<html lang="en" xmlns:th="http://www.thymeleaf.org">

<script th:src="@{/js/sys/dict.js}"></script>

<div id="dict-panel">
    <el-col :span="12">
        <el-card class="box-card">
            <div slot="header" style="line-height: 20px;">
                <span>字典项</span>
            </div>
            <div>
                <el-button-group>
                    <el-col :span="7" style="padding-right: 5px; padding-bottom: 5px">
                        <el-input placeholder="请输入名称查询" v-model="queryParam.name"></el-input>
                    </el-col>
                    <el-col :span="17" >
                        <el-button sec:authorize="hasAuthority('admin')" type="primary" icon="search" @click="queryDict">查询</el-button>
                        <el-button type="primary" icon="plus" @click="addDict">新增</el-button>
                        <el-button type="warning" icon="edit" @click="editDict">修改</el-button>
                        <el-button type="danger" icon="delete" @click="delDict">删除</el-button>
                    </el-col>
                </el-button-group>
            </div>
            <czy-page-grid ref="dictGrid" url="sys/dict/selectPageByParams" @current-change="dictGridClick">
                <el-table-column type="index" width="55px" ></el-table-column>
                <el-table-column prop="name" label="名称"></el-table-column>
                <el-table-column prop="code" label="编码"></el-table-column>
                <el-table-column prop="memo" label="备注"></el-table-column>
            </czy-page-grid>
        </el-card>
    </el-col>

    <el-col :span="12">
        <el-card class="box-card">
            <div slot="header" style="line-height: 20px;">
                <span>字典值</span>
            </div>
            <div>
                <el-button-group v-if="showItemOperateBtn == true">
                    <el-button type="primary" icon="plus" @click="addItem">新增</el-button>
                    <el-button type="warning" icon="edit" @click="editItem">修改</el-button>
                    <el-button type="danger" icon="delete" @click="delItem">删除</el-button>
                </el-button-group>
            </div>
            <czy-page-grid ref="itemGrid" url="sys/dictItem/selectPageByParams"
                           table-height="80%" auto-init="false">
                <el-table-column type="index" width="55px" ></el-table-column>
                <el-table-column prop="itemCode" label="编码"></el-table-column>
                <el-table-column prop="value" label="值"></el-table-column>
                <el-table-column prop="memo" label="备注"></el-table-column>
            </czy-page-grid>
        </el-card>
    </el-col>

    <!--维护字典项表单-->
    <el-dialog title="字典项管理" :visible.sync="dictFormShow" size="miny" :close-on-click-modal="false">
        <el-form :model="dictForm">
            <el-form-item label="字典项名称" :label-width="dictFormLabelWidth">
                <el-input v-model="dictForm.name"></el-input>
            </el-form-item>
            <el-form-item label="字典项编码" :label-width="dictFormLabelWidth">
                <el-input v-model="dictForm.code"></el-input>
            </el-form-item>
            <el-form-item label="备注" :label-width="dictFormLabelWidth">
                <el-input v-model="dictForm.memo" type="textarea" :rows="5"></el-input>
            </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button @click="editDialogShow = false">取 消</el-button>
            <el-button type="primary" @click="saveDict">确 定</el-button>
        </div>
    </el-dialog>

    <!--维护字典值表单-->
    <el-dialog title="字典值管理" :visible.sync="itemFormShow" size="miny" :close-on-click-modal="false">
        <el-form :model="itemForm">
            <el-form-item label="字典值键" :label-width="itemFormLabelWidth">
                <el-input v-model="itemForm.itemCode"></el-input>
            </el-form-item>
            <el-form-item label="字典值值" :label-width="itemFormLabelWidth">
                <el-input v-model="itemForm.value"></el-input>
            </el-form-item>
            <el-form-item label="备注" :label-width="itemFormLabelWidth">
                <el-input v-model="itemForm.memo" type="textarea" :rows="5"></el-input>
            </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button @click="editDialogShow = false">取 消</el-button>
            <el-button type="primary" @click="saveItem">确 定</el-button>
        </div>
    </el-dialog>

</div>